﻿<Page x:Class="AvalonLibraryTest.Pages.Panels"
      xmlns="http://schemas.microsoft.com/winfx/2006/xaml/presentation"
      xmlns:x="http://schemas.microsoft.com/winfx/2006/xaml"
      xmlns:av="http://schemas.codeplex.com/wpfcontrib/xaml/presentation"
      Title="Panels">
    <Grid>
        <Grid.ColumnDefinitions>
            <ColumnDefinition />
            <ColumnDefinition />
        </Grid.ColumnDefinitions>

        <DockPanel>
            <TextBlock DockPanel.Dock="Top"
                       Text="AutoGrid"
                       Margin="5"
                       FontWeight="Bold" />
            <TextBlock DockPanel.Dock="Top"
                       Margin="5"
                       TextWrapping="Wrap">
                Derived from the SDK sample AutoIndexingGrid, AutoGrid is capable of automatically setting the
                <Bold>Grid.Row</Bold> and <Bold>Grid.Column</Bold> properties, according to the child's index.
                You can also set the <Bold>ChildMargin</Bold>, <Bold>ChildHorizontalAlignment</Bold> and
                <Bold>ChildVerticalAlignment</Bold> to affect all grid children.
            </TextBlock>
            <ScrollViewer VerticalScrollBarVisibility="Auto">
                <av:AutoGrid ChildMargin="10"
                             ChildHorizontalAlignment="Stretch"
                             ChildVerticalAlignment="Top"
                             VerticalAlignment="Top">
                    <Grid.ColumnDefinitions>
                        <ColumnDefinition Width="Auto" />
                        <ColumnDefinition />
                    </Grid.ColumnDefinitions>

                    <Label Content="_ID"
                           Target="{Binding ElementName=ID}" />
                    <TextBox Name="ID" />

                    <Label Content="_Description"
                           Target="{Binding ElementName=Description}" />
                    <DockPanel>
                        <Button Content="..."
                                DockPanel.Dock="Right" />
                        <TextBox Name="Description" />
                    </DockPanel>

                    <Label Content="_Type"
                           Target="{Binding ElementName=Type}" />
                    <ComboBox Name="Type" />
                </av:AutoGrid>
            </ScrollViewer>
        </DockPanel>

        <DockPanel Grid.Column="1">
            <TextBlock DockPanel.Dock="Top"
                       Text="ColumnStackPanel"
                       Margin="5"
                       FontWeight="Bold" />
            <TextBlock DockPanel.Dock="Top"
                       Margin="5"
                       TextWrapping="Wrap">
                This panel stacks elements in columns.
            </TextBlock>

            <av:ColumnStackPanel ColumnCount="3">

                <Rectangle Fill="Red"
                           RadiusX="5"
                           RadiusY="5"
                           Height="25"
                           Margin="2"
                           av:ColumnStackPanel.EndColumn="1" />
                <Rectangle Fill="Green"
                           RadiusX="5"
                           RadiusY="5"
                           Height="30"
                           Margin="2" />
                <Rectangle Fill="Gold"
                           RadiusX="5"
                           RadiusY="5"
                           Height="20"
                           Margin="2" />

                <Rectangle Fill="Blue"
                           RadiusX="5"
                           RadiusY="5"
                           Height="20"
                           Margin="2"
                           av:ColumnStackPanel.StartColumn="1"
                           av:ColumnStackPanel.EndColumn="2" />

                <Rectangle Fill="DarkCyan"
                           RadiusX="5"
                           RadiusY="5"
                           Height="40"
                           Margin="2"
                           av:ColumnStackPanel.StartColumn="2"
                           av:ColumnStackPanel.EndColumn="2" />
                <Rectangle Fill="Magenta"
                           RadiusX="5"
                           RadiusY="5"
                           Height="20"
                           Margin="2"
                           av:ColumnStackPanel.StartColumn="2"
                           av:ColumnStackPanel.EndColumn="2" />
            </av:ColumnStackPanel>
        </DockPanel>
    </Grid>
</Page>
